<template>
  <uni-collapse :value="activeTab" @change="change">
    <uni-collapse-item :title="modelData.caption" :key="modelData.id">
      <FormContainer
        v-for="item in childDetails"
        :key="item.id"
        :controller="controller"
        :modelData="item"
      ></FormContainer>
    </uni-collapse-item>
  </uni-collapse>
</template>
<script setup lang="ts">
import { IDEFormDetail } from '@ibiz/model-core'

import { findChildFormDetails, FormController } from '@ibiz-template/runtime'

const props = defineProps({
  controller: {
    type: Object as PropType<FormController>,
    required: true,
  },
  modelData: {
    type: Object as PropType<IDEFormDetail>,
    required: true,
  },
})

const activeTab = ref('')

const change = () => {}
const close = () => {}
const open = () => {}

const childDetails = findChildFormDetails(props.modelData)
</script>
